<template>
  <div class="main">
    <div class="useravat">
      <el-row>
        <el-col :span="12">
          <el-card class="card">
            <div class="avater">
              <img style="width: 120px; height: 120px" class="image" src="@/assets/userhome/icon5.png" />
              <div class="p">
                <p>用户名：{{ usedata.username }}</p>
                <p>公司名称：{{ usedata.name }}</p>
                <p class="linep">
                  <span>成长值：</span>
                  <el-progress :percentage="100" class="progress"></el-progress>
                </p>
              </div>
            </div>
            <div class="lev">用户等级：V5</div>
          </el-card>
        </el-col>
        <el-col :span="12">
          <el-card class="card">
            <el-row>
              <el-col :span="12">
                <div class="pan">
                  <span>优惠卷</span>
                  <p>0</p>
                </div>
              </el-col>
              <el-col :span="12">
                <div class="pan ps">
                  <span>本月待还</span>
                  <p>0.00</p>
                </div>
              </el-col>
            </el-row>
          </el-card>
        </el-col>
      </el-row>
    </div>
    <div class="users">
      <el-card>
        <span>我的待办</span>
      </el-card>
    </div>
    <div>
      <el-card>
        <div class="listicon">
          <router-link :to="{ name: 'paycost' }">
            <div>
              <li class="icon">
                <img src="@/assets/userhome/icon1.png" alt style="width: 80px; height: 80px" />
              </li>
              <li class="iconlis">
                <el-badge :value="1" :max="10" class="item" style="left: 20px">
                  <p style="color:#000">缴费</p>
                </el-badge>
              </li>
            </div></router-link
          >

          <router-link :to="{ name: 'order' }">
            <div>
              <li class="icon">
                <img src="@/assets/userhome/icon2.png" alt style="width: 80px; height: 80px" />
              </li>
              <li>
                <el-badge :value="8" :max="10" class="item">
                  <p style="color:#000">待支付订单</p>
                </el-badge>
              </li>
            </div>
          </router-link>
          <!-- myContract -->
          <router-link :to="{ name: 'myContract' }">
            <div>
              <li class="icon">
                <img src="@/assets/userhome/icon3.png" alt style="width: 80px; height: 80px" />
              </li>
              <li>
                <el-badge :value="3" :max="10" class="item">
                  <p style="color:#000">待签合同</p>
                </el-badge>
              </li>
            </div>
          </router-link>
          <!-- vehicleAccess -->
          <router-link :to="{ name: 'vehicleAccess' }">
            <div>
              <li class="icon">
                <img src="@/assets/userhome/icon4.png" alt style="width: 80px; height: 80px" />
              </li>

              <el-badge :value="10" :max="10" class="item">
                <p class="pp" style="color:#000">待确认进场</p>
              </el-badge>
            </div>
          </router-link>
        </div>
      </el-card>
    </div>
    <!-- 广告区域 -->
    <div class="fotter">
      <img src="@/assets/userhome/banner.png" alt style="width: 100%; height: 100%" />
    </div>
  </div>
</template>

<script>
import { getuserlist } from '../userhome.js'
import { getItem } from '../../../utils/store.js'
export default {
  props: {
    // userdatas:{
    //   type:[Object,Array,String,Number],
    //   required:true
    // }
  },
  data() {
    return {
      usedata: [], //用户头像信息
       userid:'',
    }
  },
  components: {},
  watch: {},
  created() {
    this.userid = getItem('XIE_XIN').user_id
    this.getuserlis()
  
  },
  mounted() {},
  methods: {
    btn() {
      console.log(1)
    },
    async getuserlis() {
      //获取登录用户信息账户基础信息头像

      //   this.userid=getItem('USER_INFO').data.data.person.userId
      //  console.log(this.userid,'00000');
      let id = this.userid
      console.log(id,'0000');
      try {
        const data = await getuserlist(id)
        
        this.usedata = data.data.data
        console.log(data, '用户账户信息111')
      } catch (error) {
        console.log(error)
      }
    },
  },
}
</script>

<style  lang="less">
</style>
